<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">
    <script src="../vue.js"></script>
    <title>便签任务</title>
</head>

<body>
    <div class="page-top">
        <div class="page-content">
            <h2>任务计划列表</h2>
        </div>
    </div>
    <div class="main">
        <h3 class="big-title">添加任务</h3>
        <input type="text" class="task-input" placeholder="例如：吃饭睡觉打豆豆；    提示：+回车即可添加任务">
        <ul class="task-count">
            <li>几个任务未完成</li>
            <li class="action ">
                <a heft="# " class="active ">所有任务</a>
                <a href="# ">未完成的任务</a>
                <a href="# ">完成的任务</a>
            </li>
        </ul>
        <h3 class="big-title ">任务列表：</h3>
        <div class="tasks">
            <span class="no-task-tip">还没有添加任何任务</span>
            <ul class="todo-list">
                <li class="todo">
                    <div class="view">
                        <input class="toggle" type="checkbox" />
                        <label>fsdfsd</label>
                        <button class="destroy"></button>
                    </div>
                    <input class="edit" type="text" />
                </li>
            </ul>
        </div>
    </div>
</body>
<script src="./app.js "></script>

</html>